<!DOCTYPE html>
<html lang="en">
    <head>
        <title></title>
        <meta charset="UTF-8">
        <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
        <link rel="stylesheet" href="./../../assets/css/base.css">
        <link rel="stylesheet" href="./../../assets/css/my-supply.css">
    </head>
    <body>
        <header>
            <a href="#" class="user"><img src="./../../assets/image/arrow-left.png" alt=""></a>
            <span>我的供需</span>
            <a href="#" class="link">发布</a>
        </header>
        <ul class="tab sn-clr">
            <li class="activ">全部</li>
            <li>已发布</li>
        </ul>
        <div class="tabCon">
            <div class="item">
                <div class="zixun-list">
                    <a href="#"><img src="./../../assets/image/zixun-pic.jpeg" alt="" class="pic"></a>
                    <div class="list-right">
                        <h3>世界城光谷步行街圣诞主题定制</h3>
                        <p>
                            <img src="./../../assets/image/clock.png" alt=""><span>2017/12/3</span>
                        </p>
                        <p>
                            <img src="./../../assets/image/position.png" alt=""><span>上海市 浦东新区 正大广场</span>
                        </p>
                        <p style="float:left">
                            <img src="./../../assets/image/eye.png" alt=""><span>4308</span>
                        </p>
                    </div>
                </div>
                <div class="zixun-list">
                    <a href="#"><img src="./../../assets/image/zixun-pic.jpeg" alt="" class="pic"></a>
                    <div class="list-right">
                        <h3>世界城光谷步行街圣诞主题定制</h3>
                        <p>
                            <img src="./../../assets/image/clock.png" alt=""><span>2017/12/3</span>
                        </p>
                        <p>
                            <img src="./../../assets/image/position.png" alt=""><span>上海市 浦东新区 正大广场</span>
                        </p>
                        <p style="float:left">
                            <img src="./../../assets/image/eye.png" alt=""><span>4308</span>
                        </p>
                    </div>
                </div>
                <div class="zixun-list">
                    <a href="#"><img src="./../../assets/image/zixun-pic.jpeg" alt="" class="pic"></a>
                    <div class="list-right">
                        <h3>世界城光谷步行街圣诞主题定制</h3>
                        <p>
                            <img src="./../../assets/image/clock.png" alt=""><span>2017/12/3</span>
                        </p>
                        <p>
                            <img src="./../../assets/image/position.png" alt=""><span>上海市 浦东新区 正大广场</span>
                        </p>
                        <p style="float:left">
                            <img src="./../../assets/image/eye.png" alt=""><span>4308</span>
                        </p>
                    </div>
                </div>
            </div>
            <div class="item sn-hide">

            </div>
        </div>
    </body>
    <script src="./../../assets/build/jquery/dist/jquery.js"></script>
    <script>
        $(".tab li").on("click", function(event) {
        $(".tab li")
            .eq($(this).index())
            .addClass("activ")
            .siblings()
            .removeClass("activ");
        $(".tabCon .item")
            .hide()
            .eq($(this).index())
            .show();
        });
    </script>
</html>